import { defineComponent } from "vue";
import styles from "./title.module.less";
const lessVars = require("@/styles/var");

export default defineComponent({
  props: {
    // 标题名
    title: {
      type: String,
      required: true,
    },
    // 标题文字大小
    titleSize: {
      type: String,
      default: lessVars['font-size-base'],
    },
  },
  setup(props, { slots }: any) {
    const Title = () => (
      <div class={styles.title} style={{ '--titleSize': props.titleSize }}>
        <span>{props.title}</span>
        {
          slots?.default && slots.default()
        }
      </div>
    )
    return () => (
      <Title />
    )
  }
})